<nz-tab>
    <ng-template #nzTabHeading>
        <span (click)="getData()">班级管理</span>
    </ng-template>
    <div class="search-add-box">
        班级名称：<nz-input [nzPlaceHolder]="'请输入查询班级名称'" [(ngModel)]="searchValue" style="width: 200px;" [nzSize]="'large'"></nz-input>
        <button nz-button type="submit" class="mar-left" [nzType]="'primary'" [nzSize]="'large'" (click)="search()">查询</button>
        <button nz-button class="btn-right" [nzType]="'default'" [nzSize]="'large'" *ngIf="_checkTable.length > 0" (click)="allDelete()">
            <span>批量删除</span>
        </button>
        <button nz-button class="btn-right" (click)="modal('add', '')" [nzType]="'primary'" [nzSize]="'large'">
            <i class="anticon anticon-plus"></i><span>新建</span>
        </button>
    </div>
    <nz-table #nzTable2 [nzAjaxData]="data" [(nzPageSize)]="tableAPs" [nzTotal]="tableA" [(nzPageIndex)]="tableAPi" (nzDataChange)="_displayDataChange($event)" (nzPageIndexChange)="getData()" (nzPageSizeChange)="_refreshStatus()" [nzLoading]="_loading">
        <thead nz-thead>
        <tr>
            <th nz-th [nzCheckbox]="true">
                <label nz-checkbox [(ngModel)]="_allChecked" [nzIndeterminate]="_indeterminate" (ngModelChange)="_checkAll($event)">
                </label>
            </th>
            <th  nz-th><span>班级名称</span></th>
            <th  nz-th><span>已加入学生人数</span></th>
            <th  nz-th><span>已关联课程</span></th>
            <th  nz-th><span>操作</span></th>
        </tr>
        </thead>
        <tbody nz-tbody>
        <tr nz-tbody-tr *ngFor="let data of nzTable2.data;let i = index">
            <td nz-td [nzCheckbox]="true">
                <label nz-checkbox [(ngModel)]="data.checked" (ngModelChange)="_refreshStatus($event)">
                </label>
            </td>
            <td nz-td>{{data.cla_name }}</td>
            <td nz-td><a (click)="stuShow(data)" class="click-color">{{data.stuNum}}</a></td>
            <td nz-td><a (click)="courLists(data)" class="click-color">{{data.courseNum}}</a></td>
            <td nz-td>
                <span>
                  <a (click)="modal ('update', data)">修改</a>
                  <span nz-table-divider></span>
                  <a (click)="showConfirm(data)">删除</a>
                </span>
            </td>
        </tr>
        </tbody>
    </nz-table>
    <nz-modal  [nzWrapClassName]="'vertical-center-modal'" [nzVisible]="modalVisible2" [nzTitle]="popTitle" [nzConfirmLoading]="loading" [nzContent]="modalContent2"
               (nzOnCancel)="modalVisible2=false"  [nzOkText]="'确定'" [nzCancelText]="'取消'" (nzOnOk)="save()">
        <ng-template #modalContent2>
            <form nz-form [nzType]="'horizontal'" [formGroup]="validateForm">
                <div nz-form-item class="d-flex d-flex-margin">
                    <div nz-form-item-required class="til-box">班级名称：</div>
                    <!--<div nz-form-control class="flex-1" nzHasFeedback  [nzValidateStatus]="getFormControl('C_name')">-->
                    <div nz-form-control class="flex-1">
                        <nz-input [(ngModel)]="Cname" name="description" [nzSize]="'large'" formControlName="C_name"  [nzPlaceHolder]="'请输入'" nzId="no"></nz-input>
                        <!--<div nz-form-explain *ngIf="getFormControl('C_name').dirty&&getFormControl('C_name').hasError('required')">班级名称不能为空！</div>-->
                    </div>
                </div>
            </form>
            <div nz-form-item class="d-flex d-flex-margin">
                <div nz-form-label class="til-box">已关联课程：</div>
                <div nz-form-control class="flex-1">
                    <nz-select style="width: 100%;"
                               [nzMode]="'multiple'"
                               [nzPlaceHolder]="'请选择关联课程'"
                               [nzSize]="'large'"
                               [(ngModel)]="selectedMultipleOption"
                               [nzNotFoundContent]="'暂无结果'">
                        <nz-option
                            *ngFor="let option of searchOptions"
                            [nzLabel]="option.cour_name"
                            [nzValue]="option.cour_id">
                        </nz-option>
                    </nz-select>
                </div>
            </div>
        </ng-template>
    </nz-modal>
    <nz-modal [nzWrapClassName]="'vertical-center-modal'" [nzVisible]="showStudents" [nzTitle]="'查看学生'" [nzConfirmLoading]="loading" [nzContent]="modalContent"
               (nzOnCancel)="showStudents=false" (nzOnOk)="showStudents=false" [nzStyle]="style" [nzOkText]="'确定'" [nzCancelText]="'取消'" >
        <ng-template #modalContent>

            <div nz-form-item class="d-flex d-flex-margin" >
                <div nz-form-label class="til-box tils">班级名称：</div>
                <div nz-form-control class="flex-1">
                    {{className}}
                </div>

                <button nz-button class="btn-right" [nzType]="'default'" [nzSize]="'large'" *ngIf="_checkTableStu.length > 0" (click)="allDeleteStu()">
                    <span>删除</span>
                </button>
            </div>
            <div class="stu_chooseall">
                <label nz-checkbox [(ngModel)]="_allCheckedStu" [nzIndeterminate]="_indeterminateStu" (ngModelChange)="_checkAllStu($event)"> </label>
                全选
            </div>
            <ul class="student-box">
                <li *ngFor="let i of student">
                    <div class="check-pop"> <label  nz-checkbox [(ngModel)]="i.checked" (ngModelChange)="_refreshStatusStu(student)"></label></div>
                    <img _src="{{IP_PORT+i.ImagePath}}" class="header-img"/>
                    <!--<img src="./assets/img/open.png" class="open" (click)="delStudent(i)"/>-->
                    <div class="student-news">
                        <p>{{i.UserName}}</p>
                        <p>{{i.jointime.slice(0,10)}}</p>
                    </div>
                </li>
            </ul>

        </ng-template>
    </nz-modal>
    <nz-modal  [nzWrapClassName]="'vertical-center-modal'" [nzFooter]="''" [nzVisible]="showClass" [nzTitle]="'开始授课'" [nzConfirmLoading]="loading" [nzContent]="modalContent1"
               (nzOnCancel)="showClass=false" (nzOnOk)="showClass=false" [nzStyle]="style" [nzOkText]="'确定'" [nzCancelText]="'取消'">
        <ng-template #modalContent1>
            <nz-table #nzTable [nzDataSource]="classList" [nzPageSize]="3" (nzPageIndexChange)="_refreshStatus()" (nzPageSizeChange)="_refreshStatus()" [nzLoading]="_loading">
                <thead nz-thead>
                <tr>
                    <th  nz-th><span>课程名称</span></th>
                    <th  nz-th><span>项目名称</span></th>
                    <th  nz-th><span>项目属性</span></th>
                    <th  nz-th><span>操作</span></th>
                </tr>
                </thead>
                <tbody nz-tbody>
                <tr nz-tbody-tr *ngFor="let data of nzTable.data;let i = index">
                    <td nz-td>{{data.cour_name}}</td>
                    <td nz-td>{{data.p_name}}</td>
                    <td nz-td >{{data.p_type | json:'label'}}</td>
                    <td nz-td>
                        <span (click)="play(data)">
                          <i class="anticon anticon-caret-right"></i>
                        </span>
                    </td>
                </tr>
                </tbody>
            </nz-table>
        </ng-template>
    </nz-modal>
</nz-tab>
